{% extends 'base.html' %}
{% block content %}
<div class="card" style="max-width:900px;margin:30px auto;padding:30px 40px;box-shadow:0 2px 12px #eee;border-radius:12px;">
  <h2 style="margin-bottom:24px;">确认续费订单</h2>
  <form method="post" action="{% url 'renew_submit' %}" style="margin-bottom:0;">
    {% csrf_token %}
    <input type="hidden" name="package" value="{{ package }}">
    <input type="hidden" name="customer_id" value="{{ customer.id }}">
    {% for card in cards %}
      <input type="hidden" name="card_ids" value="{{ card.id }}">
    {% endfor %}
    <div style="margin-bottom:18px;font-size:16px;">续费卡数：<b>{{ cards|length }}</b></div>
    <table class="table table-bordered table-hover" style="background:#fff;">
      <thead class="thead-light">
        <tr>
          <th>卡号</th>
          <th>套餐</th>
          <th>价格</th>
        </tr>
      </thead>
      <tbody>
      {% for item in price_list %}
        <tr>
          <td>{{ item.card.iccid }}</td>
          <td>{{ item.card.packageName }}</td>
          <td>{{ item.price }}</td>
        </tr>
      {% endfor %}
      </tbody>
    </table>
    <div style="margin:18px 0;font-size:16px;">
      <span>总金额：</span>
      {% if can_modify %}
        <input type="text" name="amount" value="{{ total_price }}" class="form-control" style="width:120px;display:inline-block;">
      {% else %}
        <b>{{ total_price }}</b>
        <input type="hidden" name="amount" value="{{ total_price }}">
      {% endif %}
    </div>
    <div style="display:flex;justify-content:flex-end;gap:16px;">
      <button type="button" class="btn btn-outline-secondary" onclick="window.history.back()" style="width:120px;">上一步</button>
      <button type="submit" class="btn btn-success" style="width:120px;">提交订单</button>
    </div>
  </form>
</div>
{% endblock %}
